import { Button, Space, Input } from 'antd'
import { versionPathOperation } from "@/utils/index";

export const stateHook = () => {
  return {
    path1: versionPathOperation.get('versionPath'),
    path2: versionPathOperation.get('config'),
    zhucheng_code: versionPathOperation.get('zhucheng_code') || '3',
  }
}

function App({
  config,
  setConfig,
}): JSX.Element {

  return (
    <>
      <Space>
        <div>
          <p>版本服务器所在路径:</p>
          <div className='flex'>
            <Input size='small' spellCheck="false" value={config.path1} />

            <div className='file-box'>
              <Button size='small' type='primary' onClick={() => {
                const c = {
                  ...config
                }
                c.path1 = window.api.syncOperationWindow('selectDirectory')
                versionPathOperation.save('versionPath', c.path1)
                setConfig(c)
              }}>浏览</Button>
            </div>
          </div>
        </div>

        <div>
          <p>
            默认使用软件内置的配置文件(也可自己上传):
          </p>
          <div className='flex'>
            <Input size='small' spellCheck="false" value={config.path2} />

            <div className='file-box'>
              <Button size='small' type='primary' onClick={() => {
                const c = {
                  ...config
                }
                c.path2 = window.api.syncOperationWindow('selectDirectory')
                versionPathOperation.save('config', c.path2)
                setConfig(c)
              }}>浏览</Button>
            </div>
          </div>
        </div>

        <div>
          <p>请输入主城代码(一般是3):</p>
          <Input size='small' spellCheck="false" value={config.zhucheng_code} onChange={(e) => {
            const c = {
              ...config
            }
            c.zhucheng_code = e.target.value
            setConfig(c)
          }} />
        </div>
      </Space>
    </>
  )
}

export default App
